<template>
  <div>
    <el-row :gutter="10" style="margin-left: 3px; margin-top: 5px; margin-right: 5px">
      <!--    工程信息高级搜索-->
      <el-col :span="24">
        <el-card v-show="showAdvancedSearch">
          <el-form size="small" :inline="true" label-width="68px">
            <el-form-item label="数字化单位" prop="shuZiHuaDanWei">
              <el-input v-model="engQueryParams.shuZiHuaDanWei" placeholder="请输入数字化单位" clearable
                        @keyup.enter.native="searchEng"/>
            </el-form-item>
            <el-form-item label="移交单位" prop="yiJiaoDanWei">
              <el-input v-model="engQueryParams.yiJiaoDanWei" placeholder="请输入移交单位" clearable
                        @keyup.enter.native="searchEng"/>
            </el-form-item>
            <el-form-item label="工程地址" prop="EngAddress">
              <el-input v-model="engQueryParams.EngAddress" placeholder="请输入工程地址" clearable
                        @keyup.enter.native="searchEng"/>
            </el-form-item>
            <el-form-item label="建设单位" prop="building_unit">
              <el-input v-model="engQueryParams.building_unit" placeholder="请输入建设单位" clearable
                        @keyup.enter.native="searchEng"/>
            </el-form-item>
            <el-form-item label="立项批准单位" prop="project_approval_unit">
              <el-input v-model="engQueryParams.project_approval_unit" placeholder="请输入立项批准单位" clearable
                        @keyup.enter.native="searchEng"/>
            </el-form-item>
            <el-form-item label="设计单位" prop="design_unit">
              <el-input v-model="engQueryParams.design_unit" placeholder="请输入设计单位" clearable
                        @keyup.enter.native="searchEng"/>
            </el-form-item>
<!--            <el-form-item label="施工单位" prop="operationorg">-->
<!--              <el-input v-model="engQueryParams.operationorg" placeholder="请输入施工单位" clearable-->
<!--                        @keyup.enter.native="searchEng"/>-->
<!--            </el-form-item>-->
            <el-form-item label="勘察单位" prop="exploration_unit">
              <el-input v-model="engQueryParams.exploration_unit" placeholder="请输入勘察单位" clearable
                        @keyup.enter.native="searchEng"/>
            </el-form-item>
<!--            <el-form-item label="监理单位" prop="supervisionorg">-->
<!--              <el-input v-model="engQueryParams.supervisionorg" placeholder="请输入监理单位" clearable-->
<!--                        @keyup.enter.native="searchEng"/>-->
<!--            </el-form-item>-->
            <el-form-item label="立项批准文号" prop="project_approval_number">
              <el-input v-model="engQueryParams.project_approval_number" placeholder="请输入立项批准文号" clearable
                        @keyup.enter.native="searchEng"/>
            </el-form-item>
            <el-form-item label="规划许可证号" prop="planning_permit_number">
              <el-input v-model="engQueryParams.planning_permit_number" placeholder="请输入规划许可证号" clearable
                        @keyup.enter.native="searchEng"/>
            </el-form-item>
            <el-form-item label="用地规划许可证号" prop="land_planning_permit_number">
              <el-input v-model="engQueryParams.land_planning_permit_number" placeholder="请输入用地规划许可证号" clearable
                        @keyup.enter.native="searchEng"/>
            </el-form-item>
            <el-form-item label="施工许可证号" prop="construction_permit_number">
              <el-input v-model="engQueryParams.construction_permit_number" placeholder="请输入施工许可证号" clearable
                        @keyup.enter.native="searchEng"/>
            </el-form-item>
            <el-form-item label="开工时间" prop="start_date">
              <el-date-picker clearable v-model="engQueryParams.start_date" type="date" value-format="yyyy-MM-dd"
                              placeholder="请选择开工时间"/>
            </el-form-item>
            <el-form-item label="竣工时间" prop="completion_date">
              <el-date-picker clearable v-model="engQueryParams.completion_date" type="date" value-format="yyyy-MM-dd"
                              placeholder="请选择竣工时间"/>
            </el-form-item>
<!--            <el-form-item label="项目经理" prop="projmanager">-->
<!--              <el-input v-model="engQueryParams.projmanager" placeholder="请输入项目经理" clearable-->
<!--                        @keyup.enter.native="searchEng"/>-->
<!--            </el-form-item>-->
<!--            <el-form-item label="分部(项)工程" prop="partproj">-->
<!--              <el-input v-model="engQueryParams.partproj" placeholder="请输入分部(项)工程" clearable-->
<!--                        @keyup.enter.native="searchEng"/>-->
<!--            </el-form-item>-->
<!--            <el-form-item label="合同号" prop="cnum">-->
<!--              <el-input v-model="engQueryParams.cnum" placeholder="请输入合同号" clearable-->
<!--                        @keyup.enter.native="searchEng"/>-->
<!--            </el-form-item>-->
<!--            <el-form-item label="申请时间" prop="applydate">-->
<!--              <el-date-picker clearable v-model="engQueryParams.applydate" type="date" value-format="yyyy-MM-dd"-->
<!--                              placeholder="请选择申请时间"/>-->
<!--            </el-form-item>-->
<!--            <el-form-item label="批准时间" prop="passdate">-->
<!--              <el-date-picker clearable v-model="engQueryParams.passdate" type="date" value-format="yyyy-MM-dd"-->
<!--                              placeholder="请选择批准时间"/>-->
<!--            </el-form-item>-->
          </el-form>
        </el-card>
      </el-col>
      <!--    工程信息-->
      <el-col :span="8">
        <el-card style="height: 780px" v-loading="engLoading">
          <div slot="header" class="search-header">
            <div class="show_title">工程：</div>
            <el-input
              v-model="engQueryParams.engName"
              placeholder="搜索工程"
              clearable
              @keyup.enter.native="searchEng"
              class="my_input"
            />
            <div class="button-group">
              <el-button type="primary" icon="el-icon-search" size="mini" @click="searchEng">搜索</el-button>
              <el-button type="success" icon="el-icon-sort" size="mini" @click="toggleSearchMode">高级</el-button>
              <el-button icon="el-icon-refresh" size="mini" @click="resetEng"></el-button>
              <el-col :span="1.5">
                <el-button
                  type="primary"
                  plain
                  icon="el-icon-plus"
                  size="mini"
                  @click="handleEngAdd"
                v--if="currentInfo!=='eng'">新增</el-button>
              </el-col>
<!--              <el-col :span="1.5">-->
<!--                <el-button-->
<!--                  type="success"-->
<!--                  plain-->
<!--                  icon="el-icon-edit"-->
<!--                  size="mini"-->
<!--                  @click="handleEngUpdate"-->
<!--                  v-hasPermi="['system:eng:edit']"-->
<!--                  v-if="currentInfo==='eng'">修改</el-button>-->
<!--              </el-col>-->
              <el-col :span="1.5">
                <el-button
                  type="danger"
                  plain
                  icon="el-icon-delete"
                  size="mini"
                  @click="handleEngDelete"
                  v-if="currentInfo==='eng'">删除</el-button>
              </el-col>
            </div>
          </div>
          <div class="engs-container" ref="engsContainer">
            <div
              class="eng-row"
              v-for="eng in engList"
              :key="eng.id"
              @click="selectEng(eng)"
              :class="{ selected: eng === selectedEng }"
            >
              <i class="folder-icon eng-folder-icon"></i>
              <div slot="reference" class="name-wrapper">
                <span class="folder-name" style="display: inline-block; width: 100%; word-wrap: break-word; white-space: normal;">{{ eng.engName }}</span>
              </div>
            </div>
          </div>
          <div class="pagination-container">
            <!-- 分页信息 -->
            <el-pagination
              @size-change="handleSizeChangeEng"
              @current-change="handleCurrentChangeEng"
              :current-page.sync="engQueryParams.pageNum"
              :page-size.sync="engQueryParams.pageSize"
              layout="total, prev, pager, next, jumper"
              :pager-count="5"
              :total="engTotal"
            ></el-pagination>
          </div>
        </el-card>
      </el-col>
      <!-- 添加或修改【请填写功能名称】对话框 -->
      <el-dialog :title="title" :visible.sync="open_eng" width="1500px" append-to-body
                 :close-on-click-modal="false"
                 :close-on-press-escape="false">
        <el-form ref="form" :model="form" :rules="rules" label-width="130px">
          <!-- 工程基本信息 -->
          <el-row :gutter="20">
            <el-col :span="16">
              <el-form-item label="工程名称" prop="engName">
                <el-input v-model="form.engName" placeholder="请输入工程名称" />
              </el-form-item>
            </el-col>
          </el-row>

          <el-row :gutter="20">
            <el-col :span="8">
              <el-form-item label="工程编号" prop="engNo">
                <el-input v-model="form.engNo" placeholder="请输入工程编号" />
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="工程识别号" prop="engineeringIdentificationNumber">
                <el-input v-model="form.engineeringIdentificationNumber" placeholder="请输入工程识别号" />
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="单位工程类型" prop="unitConstructionCategory">
                <el-input v-model="form.unitConstructionCategory" placeholder="请输入单位工程类型" />
              </el-form-item>
            </el-col>
          </el-row>

          <el-row :gutter="20">
            <el-col :span="8">
              <el-form-item label="档案类属" prop="archiveCategory">
                <el-input v-model="form.archiveCategory" placeholder="请输入档案类属" />
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="建设单位" prop="buildingUnit">
                <el-input v-model="form.buildingUnit" placeholder="请输入建设单位" />
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="移交单位" prop="yiJiaoDanWei">
                <el-input v-model="form.yiJiaoDanWei" placeholder="请输入移交单位" />
              </el-form-item>
            </el-col>
          </el-row>

          <el-row :gutter="20">
            <el-col :span="8">
              <el-form-item label="立项批准单位" prop="projectApprovalUnit">
                <el-input v-model="form.projectApprovalUnit" placeholder="请输入立项批准单位" />
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="立项批准文号" prop="projectApprovalNumber">
                <el-input v-model="form.projectApprovalNumber" placeholder="请输入立项批准文号" />
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="规划许可证号" prop="planningPermitNumber">
                <el-input v-model="form.planningPermitNumber" placeholder="请输入规划许可证号" />
              </el-form-item>
            </el-col>
          </el-row>

          <el-row :gutter="20">
            <el-col :span="8">
              <el-form-item label="用地规划许可证号" prop="landPlanningPermitNumber">
                <el-input v-model="form.landPlanningPermitNumber" placeholder="请输入用地规划许可证号" />
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="用地许可证号" prop="landUsePermitNumber">
                <el-input v-model="form.landUsePermitNumber" placeholder="请输入用地许可证号" />
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="施工许可证号" prop="constructionPermitNumber">
                <el-input v-model="form.constructionPermitNumber" placeholder="请输入施工许可证号" />
              </el-form-item>
            </el-col>
          </el-row>

          <el-row :gutter="20">
            <el-col :span="8">
              <el-form-item label="档案馆名称" prop="dangAnGuanName">
                <el-input v-model="form.dangAnGuanName" placeholder="请输入档案馆名称" />
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="档案馆代号" prop="dangAnGuanNo">
                <el-input v-model="form.dangAnGuanNo" placeholder="请输入档案馆代号,数字化部输入" />
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="工程地址" prop="EngAddress">
                <el-input v-model="form.EngAddress" placeholder="请输入工程地址" />
              </el-form-item>
            </el-col>
          </el-row>

          <el-row :gutter="20">
            <el-col :span="8">
              <el-form-item label="编制单位" prop="bianZhiDanWei">
                <el-input v-model="form.bianZhiDanWei" placeholder="请输入编制单位" />
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="编制开始时间" prop="bianZhiDateStart">
                <el-date-picker clearable
                                v-model="form.bianZhiDateStart"
                                type="date"
                                value-format="yyyy-MM-dd"
                                placeholder="请选择编制开始时间">
                </el-date-picker>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="编制结束时间" prop="bianZhiDateEnd">
                <el-date-picker clearable
                                v-model="form.bianZhiDateEnd"
                                type="date"
                                value-format="yyyy-MM-dd"
                                placeholder="请选择编制结束时间">
                </el-date-picker>
              </el-form-item>
            </el-col>
          </el-row>

          <el-row :gutter="20">
            <el-col :span="8">
              <el-form-item label="案卷数" prop="AnJuanShu">
                <el-input v-model="form.AnJuanShu" placeholder="请输入案卷数" />
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="开工日期" prop="startDate">
                <el-date-picker clearable
                                v-model="form.startDate"
                                type="date"
                                value-format="yyyy-MM-dd"
                                placeholder="请选择开工日期">
                </el-date-picker>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="竣工日期" prop="completionDate">
                <el-date-picker clearable
                                v-model="form.completionDate"
                                type="date"
                                value-format="yyyy-MM-dd"
                                placeholder="请选择竣工日期">
                </el-date-picker>
              </el-form-item>
            </el-col>
          </el-row>

          <el-row :gutter="20">
            <el-col :span="8">
              <el-form-item label="勘察单位" prop="explorationUnit">
                <el-input v-model="form.explorationUnit" placeholder="请输入勘察单位" />
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="设计单位" prop="designUnit">
                <el-input v-model="form.designUnit" placeholder="请输入设计单位" />
              </el-form-item>
            </el-col>
            <el-col :span="8">
            </el-col>
          </el-row>


<!--          <el-form-item label="工程名称" prop="engName">-->
<!--            <el-input v-model="form.engName" placeholder="请输入工程名称" />-->
<!--          </el-form-item>-->
<!--          <el-form-item label="工程编号" prop="engNo">-->
<!--            <el-input v-model="form.engNo" placeholder="请输入工程编号,数字化部输入,电子档案接收室提供格式：2016-108" />-->
<!--          </el-form-item>-->
<!--          <el-form-item label="档案馆代号" prop="dangAnGuanNo">-->
<!--            <el-input v-model="form.dangAnGuanNo" placeholder="请输入档案馆代号,数字化部输入" />-->
<!--          </el-form-item>-->
<!--          <el-form-item label="移交单位" prop="yiJiaoDanWei">-->
<!--            <el-input v-model="form.yiJiaoDanWei" placeholder="请输入移交单位" />-->
<!--          </el-form-item>-->
<!--          <el-form-item label="编制单位" prop="bianZhiDanWei">-->
<!--            <el-input v-model="form.bianZhiDanWei" placeholder="请输入编制单位" />-->
<!--          </el-form-item>-->
<!--          <el-form-item label="编制开始时间" prop="bianZhiDateStart">-->
<!--            <el-date-picker clearable-->
<!--                            v-model="form.bianZhiDateStart"-->
<!--                            type="date"-->
<!--                            value-format="yyyy-MM-dd"-->
<!--                            placeholder="请选择编制开始时间">-->
<!--            </el-date-picker>-->
<!--          </el-form-item>-->
<!--          <el-form-item label="编制结束时间" prop="bianZhiDateEnd">-->
<!--            <el-date-picker clearable-->
<!--                            v-model="form.bianZhiDateEnd"-->
<!--                            type="date"-->
<!--                            value-format="yyyy-MM-dd"-->
<!--                            placeholder="请选择编制结束时间">-->
<!--            </el-date-picker>-->
<!--          </el-form-item>-->
<!--          <el-form-item label="工程地址" prop="EngAddress">-->
<!--            <el-input v-model="form.EngAddress" placeholder="请输入工程地址" />-->
<!--          </el-form-item>-->
<!--          <el-form-item label="总投资金额" prop="engCost">-->
<!--            <el-input v-model="form.engCost" placeholder="请输入总投资金额" />-->
<!--          </el-form-item>-->
<!--          <el-form-item label="案卷数" prop="AnJuanShu">-->
<!--            <el-input v-model="form.AnJuanShu" placeholder="请输入案卷数" />-->
<!--          </el-form-item>-->
<!--          <el-form-item label="档案馆名称" prop="dangAnGuanName">-->
<!--            <el-input v-model="form.dangAnGuanName" placeholder="请输入档案馆名称" />-->
<!--          </el-form-item>-->
<!--          <el-form-item label="数字化单位" prop="shuZiHuaDanWei">-->
<!--            <el-input v-model="form.shuZiHuaDanWei" placeholder="请输入数字化单位" />-->
<!--          </el-form-item>-->
<!--          <el-form-item label="工程状态值" prop="status">-->
<!--            <el-select v-model="form.projectStatus" placeholder="请选择审核状态">-->
<!--              <el-option v-for="(item, index) in statusOptions" :key="index" :label="item.label"-->
<!--                         :value="item.value" :disabled="item.disabled"></el-option>-->
<!--            </el-select>-->
<!--          </el-form-item>-->
<!--          <el-form-item label="文件目录" prop="fileDirectory">-->
<!--            <el-input v-model="form.fileDirectory" placeholder="请输入文件目录，文件存入服务器自动生成" />-->
<!--          </el-form-item>-->
<!--          <el-form-item label="创建时间" prop="creationTime">-->
<!--            <el-date-picker clearable-->
<!--                            v-model="form.creationTime"-->
<!--                            type="date"-->
<!--                            value-format="yyyy-MM-dd"-->
<!--                            placeholder="请选择创建时间">-->
<!--            </el-date-picker>-->
<!--          </el-form-item>-->
<!--          <el-form-item label="是新文档" prop="isNewEng">-->
<!--            <el-input v-model="form.isNewEng" placeholder="请输入0:否   1：是" />-->
<!--          </el-form-item>-->
<!--          <el-form-item label="是否有其它文件" prop="isHasOtherFile">-->
<!--            <el-input v-model="form.isHasOtherFile" placeholder="请输入0:否   1：是" />-->
<!--          </el-form-item>-->
          <!--        <el-form-item label="${comment}" prop="yuLiuA">-->
          <!--          <el-input v-model="form.yuLiuA" placeholder="请输入${comment}" />-->
          <!--        </el-form-item>-->
<!--          <el-form-item label="是否审核" prop="yuLiuB">-->
<!--            <el-input v-model="form.yuLiuB" placeholder="请输入" />-->
<!--          </el-form-item>-->
          <!--        <el-form-item label="${comment}" prop="yuLiuC">-->
          <!--          <el-input v-model="form.yuLiuC" placeholder="请输入${comment}" />-->
          <!--        </el-form-item>-->
          <!--        <el-form-item label="${comment}" prop="yuLiuD">-->
          <!--          <el-input v-model="form.yuLiuD" placeholder="请输入${comment}" />-->
          <!--        </el-form-item>-->
          <!--        <el-form-item label="${comment}" prop="yuLiuE">-->
          <!--          <el-input v-model="form.yuLiuE" placeholder="请输入${comment}" />-->
          <!--        </el-form-item>-->
<!--          <el-form-item label="工程识别号" prop="engineeringIdentificationNumber">-->
<!--            <el-input v-model="form.engineeringIdentificationNumber" placeholder="请输入工程识别号" />-->
<!--          </el-form-item>-->
<!--          <el-form-item label="单位工程类型" prop="unitConstructionCategory">-->
<!--            <el-input v-model="form.unitConstructionCategory" placeholder="请输入单位工程类型" />-->
<!--          </el-form-item>-->
<!--          <el-form-item label="档案分类" prop="archiveClassification">-->
<!--            <el-input v-model="form.archiveClassification" placeholder="请输入档案分类" />-->
<!--          </el-form-item>-->
<!--          <el-form-item label="档案类属" prop="archiveCategory">-->
<!--            <el-input v-model="form.archiveCategory" placeholder="请输入档案类属" />-->
<!--          </el-form-item>-->
<!--          <el-form-item label="建设单位" prop="buildingUnit">-->
<!--            <el-input v-model="form.buildingUnit" placeholder="请输入建设单位" />-->
<!--          </el-form-item>-->
<!--          <el-form-item label="立项批准单位" prop="projectApprovalUnit">-->
<!--            <el-input v-model="form.projectApprovalUnit" placeholder="请输入立项批准单位" />-->
<!--          </el-form-item>-->
<!--          <el-form-item label="立项批准文号" prop="projectApprovalNumber">-->
<!--            <el-input v-model="form.projectApprovalNumber" placeholder="请输入立项批准文号" />-->
<!--          </el-form-item>-->
<!--          <el-form-item label="规划许可证号" prop="planningPermitNumber">-->
<!--            <el-input v-model="form.planningPermitNumber" placeholder="请输入规划许可证号" />-->
<!--          </el-form-item>-->
<!--          <el-form-item label="用地规划许可证号" prop="landPlanningPermitNumber">-->
<!--            <el-input v-model="form.landPlanningPermitNumber" placeholder="请输入用地规划许可证号" />-->
<!--          </el-form-item>-->
<!--          <el-form-item label="用地许可证号" prop="landUsePermitNumber">-->
<!--            <el-input v-model="form.landUsePermitNumber" placeholder="请输入用地许可证号" />-->
<!--          </el-form-item>-->
<!--          <el-form-item label="施工许可证号" prop="constructionPermitNumber">-->
<!--            <el-input v-model="form.constructionPermitNumber" placeholder="请输入施工许可证号" />-->
<!--          </el-form-item>-->
<!--          <el-form-item label="总长度" prop="totalLength">-->
<!--            <el-input v-model="form.totalLength" placeholder="请输入总长度" />-->
<!--          </el-form-item>-->
<!--          <el-form-item label="案卷页数" prop="archivePageNumber">-->
<!--            <el-input v-model="form.archivePageNumber" placeholder="请输入案卷页数" />-->
<!--          </el-form-item>-->
<!--          <el-form-item label="开工日期" prop="startDate">-->
<!--            <el-date-picker clearable-->
<!--                            v-model="form.startDate"-->
<!--                            type="date"-->
<!--                            value-format="yyyy-MM-dd"-->
<!--                            placeholder="请选择开工日期">-->
<!--            </el-date-picker>-->
<!--          </el-form-item>-->
<!--          <el-form-item label="竣工日期" prop="completionDate">-->
<!--            <el-date-picker clearable-->
<!--                            v-model="form.completionDate"-->
<!--                            type="date"-->
<!--                            value-format="yyyy-MM-dd"-->
<!--                            placeholder="请选择竣工日期">-->
<!--            </el-date-picker>-->
<!--          </el-form-item>-->
<!--          <el-form-item label="起点" prop="startPoint">-->
<!--            <el-input v-model="form.startPoint" placeholder="请输入起点" />-->
<!--          </el-form-item>-->
<!--          <el-form-item label="止点" prop="endPoint">-->
<!--            <el-input v-model="form.endPoint" placeholder="请输入止点" />-->
<!--          </el-form-item>-->
<!--          <el-form-item label="勘察单位" prop="explorationUnit">-->
<!--            <el-input v-model="form.explorationUnit" placeholder="请输入勘察单位" />-->
<!--          </el-form-item>-->
<!--          <el-form-item label="勘察项目负责人" prop="explorationProjectLeader">-->
<!--            <el-input v-model="form.explorationProjectLeader" placeholder="请输入勘察项目负责人" />-->
<!--          </el-form-item>-->
<!--          <el-form-item label="设计单位" prop="designUnit">-->
<!--            <el-input v-model="form.designUnit" placeholder="请输入设计单位" />-->
<!--          </el-form-item>-->
<!--          <el-form-item label="设计项目负责人" prop="designProjectLeader">-->
<!--            <el-input v-model="form.designProjectLeader" placeholder="请输入设计项目负责人" />-->
<!--          </el-form-item>-->
<!--          <el-form-item label="注册表id" prop="register">-->
<!--            <el-input v-model="form.register" placeholder="请输入注册表id" />-->
<!--          </el-form-item>-->
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button type="primary" @click="submitFormEng">确 定</el-button>
          <el-button @click="cancelEng">取 消</el-button>
        </div>
      </el-dialog>
      <!--    案卷信息-->
      <el-col :span="9">
        <el-card style="height: 780px" v-loading="anjuanLoading">
          <div slot="header" class="search-header">
            <div class="show_title">案卷目录：</div>
            <el-input
              v-model="anjuanQueryParams.anJuanName"
              placeholder="搜索案卷"
              clearable
              @keyup.enter.native="searchAnjuan"
              class="my_input"
              style="width: 150px;"
            />
            <div class="button-group">
              <el-button type="primary" icon="el-icon-search" size="mini" @click="searchAnjuan">搜索</el-button>
              <el-button icon="el-icon-refresh" size="mini" @click="resetAnjuan"></el-button>
            </div>
            <!-- 新增、编辑、删除按钮 -->
            <el-col :span="1.5">
              <el-button
                type="primary"
                plain
                icon="el-icon-plus"
                size="mini"
                :disabled="single1"
                @click="handleAdd"
                v-if="currentInfo==='eng'">新增</el-button>
            </el-col>
<!--            <el-col :span="1.5">-->
<!--              <el-button-->
<!--                type="success"-->
<!--                plain-->
<!--                icon="el-icon-edit"-->
<!--                size="mini"-->
<!--                :disabled="single"-->
<!--                @click="handleUpdate"-->
<!--                v-hasPermi="['system:anjuan:edit']"-->
<!--               v-if="currentInfo==='anjuan'">修改</el-button>-->
<!--            </el-col>-->
            <el-col :span="1.5">
              <el-button
                type="danger"
                plain
                icon="el-icon-delete"
                size="mini"
                :disabled="single"
                @click="handleDelete"
                v-if="currentInfo==='anjuan'">删除</el-button>
            </el-col>
          </div>
          <div class="engs-container" ref="anjuanContainer">
            <div
              class="eng-row"
              v-for="anjuan in anjuanList"
              :key="anjuan.id"
              @click="selectAnjuan(anjuan)"
              :class="{ selected: anjuan === selectedAnjuan }"
            >
              <i class="folder-icon volume-folder-icon"></i>
              <div slot="reference" class="name-wrapper">
                <span class="folder-name" style="display: inline-block; width: 100%; word-wrap: break-word; white-space: normal;">{{ anjuan.anJuanName }}</span>
              </div>
            </div>
          </div>
          <div class="pagination-container">
            <!-- 分页信息 -->
            <el-pagination
              @size-change="handleSizeChangeAnjuan"
              @current-change="handleCurrentChangeAnjuan"
              :current-page.sync="anjuanQueryParams.pageNum"
              :page-size.sync="anjuanQueryParams.pageSize"
              layout="total, prev, pager, next, jumper"
              :pager-count="5"
              :total="anjuanTotal"
            ></el-pagination>
          </div>
        </el-card>
      </el-col>
      <!-- 添加或修改案卷管理对话框 -->
      <el-dialog :title="title" :visible.sync="open" width="1500px" append-to-body
                 :close-on-click-modal="false"
                 :close-on-press-escape="false">
        <el-form ref="form" :model="form" :rules="rules" label-width="80px">

          <!-- 基本信息 -->
          <el-row :gutter="20">
            <el-col :span="16">
              <el-form-item label="案卷名" prop="anJuanName">
                <el-input v-model="form.anJuanName" placeholder="请输入案卷名，数字化部输入" />
              </el-form-item>
            </el-col>
          </el-row>

          <el-row :gutter="20">
<!--            <el-col :span="12">-->
<!--              <el-form-item label="电子档案工程表" prop="eeid">-->
<!--                <el-input v-model="form.eeid" :readonly="true" placeholder="请输入电子档案工程表" />-->
<!--              </el-form-item>-->
<!--            </el-col>-->
            <el-col :span="8">
              <el-form-item label="档号" prop="vnum">
                <el-input v-model="form.vnum" placeholder="请输入档号" />
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="编制单位" prop="buildorganization">
                <el-input v-model="form.buildorganization" placeholder="请输入编制单位" />
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="数量/单位" prop="amount">
                <el-input v-model="form.amount" placeholder="请输入数量/单位" />
              </el-form-item>
            </el-col>
          </el-row>

          <el-row :gutter="20">
<!--            <el-col :span="12">-->
<!--              <el-form-item label="文件目录" prop="fileDirectory">-->
<!--                <el-input v-model="form.fileDirectory" placeholder="请输入文件目录" />-->
<!--              </el-form-item>-->
<!--            </el-col>-->
<!--            <el-col :span="8">-->
<!--              <el-form-item label="创建时间" prop="creationTime">-->
<!--                <el-date-picker-->
<!--                  clearable-->
<!--                  v-model="form.creationTime"-->
<!--                  type="date"-->
<!--                  value-format="yyyy-MM-dd"-->
<!--                  placeholder="请选择创建时间"-->
<!--                />-->
<!--              </el-form-item>-->
<!--            </el-col>-->
            <el-col :span="8">
              <el-form-item label="文件总数" prop="totalfile">
                <el-input v-model="form.totalfile" placeholder="请输入文件总数" />
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="开始时间" prop="filestart">
                <el-date-picker
                  clearable
                  v-model="form.filestart"
                  type="date"
                  value-format="yyyy-MM-dd"
                  placeholder="请选择开始时间"
                />
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="结束时间" prop="fileend">
                <el-date-picker
                  clearable
                  v-model="form.fileend"
                  type="date"
                  value-format="yyyy-MM-dd"
                  placeholder="请选择结束时间"
                />
              </el-form-item>
            </el-col>
          </el-row>

<!--          <el-row :gutter="20">-->
<!--            <el-col :span="12">-->
<!--              <el-form-item label="盒号" prop="henum">-->
<!--                <el-input v-model="form.henum" placeholder="请输入盒号" />-->
<!--              </el-form-item>-->
<!--            </el-col>-->
<!--            <el-col :span="12">-->
<!--              <el-form-item label="文件题名" prop="tname">-->
<!--                <el-input v-model="form.tname" placeholder="请输入文件题名" />-->
<!--              </el-form-item>-->
<!--            </el-col>-->
<!--          </el-row>-->

          <!-- 文件详情 -->
<!--          <el-row :gutter="20">-->
<!--            <el-col :span="12">-->
<!--              <el-form-item label="编制单位" prop="buildorganization">-->
<!--                <el-input v-model="form.buildorganization" placeholder="请输入编制单位" />-->
<!--              </el-form-item>-->
<!--            </el-col>-->
<!--            <el-col :span="12">-->
<!--              <el-form-item label="数量/单位" prop="amount">-->
<!--                <el-input v-model="form.amount" placeholder="请输入数量/单位" />-->
<!--              </el-form-item>-->
<!--            </el-col>-->
<!--          </el-row>-->

<!--          <el-row :gutter="20">-->
<!--            <el-col :span="12">-->
<!--              <el-form-item label="纸张规格" prop="spec">-->
<!--                <el-input v-model="form.spec" placeholder="请输入纸张规格" />-->
<!--              </el-form-item>-->
<!--            </el-col>-->
<!--&lt;!&ndash;            <el-col :span="12">&ndash;&gt;-->
<!--              <el-form-item label="文件开始时间" prop="filestart">-->
<!--                <el-date-picker-->
<!--                  clearable-->
<!--                  v-model="form.filestart"-->
<!--                  type="date"-->
<!--                  value-format="yyyy-MM-dd"-->
<!--                  placeholder="请选择文件开始时间"-->
<!--                />-->
<!--              </el-form-item>-->
<!--            </el-col>-->
<!--          </el-row>-->

<!--          <el-row :gutter="20">-->
<!--            <el-col :span="12">-->
<!--              <el-form-item label="结束时间" prop="fileend">-->
<!--                <el-date-picker-->
<!--                  clearable-->
<!--                  v-model="form.fileend"-->
<!--                  type="date"-->
<!--                  value-format="yyyy-MM-dd"-->
<!--                  placeholder="请选择结束时间"-->
<!--                />-->
<!--              </el-form-item>-->
<!--            </el-col>-->
<!--            <el-col :span="12">-->
<!--              <el-form-item label="保存期限" prop="savetime">-->
<!--                <el-input v-model="form.savetime" placeholder="请输入保存期限" />-->
<!--              </el-form-item>-->
<!--            </el-col>-->
<!--          </el-row>-->

          <!-- 存储和安全 -->
          <el-row :gutter="20">
            <el-col :span="8">
              <el-form-item label="文件级别" prop="securitylayer">
                <el-input v-model="form.securitylayer" placeholder="请输入文件级别" />
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="保存期限" prop="savetime">
                <el-input v-model="form.savetime" placeholder="请输入保存期限" />
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="纸张规格" prop="spec">
                <el-input v-model="form.spec" placeholder="请输入纸张规格" />
              </el-form-item>
            </el-col>
<!--            <el-col :span="12">-->
<!--              <el-form-item label="主题词" prop="thematic">-->
<!--                <el-input v-model="form.thematic" placeholder="请输入主题词" />-->
<!--              </el-form-item>-->
<!--            </el-col>-->
          </el-row>

          <el-row :gutter="20">
            <el-col :span="8">
              <el-form-item label="立卷人" prop="injectionperson">
                <el-input v-model="form.injectionperson" placeholder="请输入立卷人" />
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="立卷时间" prop="injectiondate">
                <el-date-picker
                  clearable
                  v-model="form.injectiondate"
                  type="date"
                  value-format="yyyy-MM-dd"
                  placeholder="请选择立卷时间"
                />
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="存放位置" prop="storeposition">
                <el-input v-model="form.storeposition" placeholder="请输入实体档案存放位置" />
              </el-form-item>
            </el-col>
<!--            <el-col :span="12">-->
<!--              <el-form-item label="附注" prop="annotations">-->
<!--                <el-input v-model="form.annotations" placeholder="请输入附注" />-->
<!--              </el-form-item>-->
<!--            </el-col>-->
          </el-row>

<!--          &lt;!&ndash; 页面计数 &ndash;&gt;-->
<!--          <el-row :gutter="20">-->
<!--            <el-col :span="12">-->
<!--              <el-form-item label="总页数" prop="totalpage">-->
<!--                <el-input v-model="form.totalpage" placeholder="请输入总页数" />-->
<!--              </el-form-item>-->
<!--            </el-col>-->
<!--            <el-col :span="12">-->
<!--              <el-form-item label="文字页数" prop="txtpage">-->
<!--                <el-input v-model="form.txtpage" placeholder="请输入文字页数" />-->
<!--              </el-form-item>-->
<!--            </el-col>-->
<!--          </el-row>-->

          <!-- 人员和日期 -->
          <el-row :gutter="20">
<!--            <el-col :span="12">-->
<!--              <el-form-item label="创建人" prop="cmen">-->
<!--                <el-input v-model="form.cmen" placeholder="请输入创建人" />-->
<!--              </el-form-item>-->
<!--            </el-col>-->
            <el-col :span="8">
              <el-form-item label="校对人" prop="assessor">
                <el-input v-model="form.assessor" placeholder="请输入校对人" />
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="校对时间" prop="atime">
                <el-date-picker
                  clearable
                  v-model="form.atime"
                  type="date"
                  value-format="yyyy-MM-dd"
                  placeholder="请选择校对时间"
                />
              </el-form-item>
            </el-col>
<!--            <el-col :span="12">-->
<!--              <el-form-item label="创建时间" prop="ctime">-->
<!--                <el-date-picker-->
<!--                  clearable-->
<!--                  v-model="form.ctime"-->
<!--                  type="date"-->
<!--                  value-format="yyyy-MM-dd"-->
<!--                  placeholder="请选择创建时间"-->
<!--                />-->
<!--              </el-form-item>-->
<!--            </el-col>-->
          </el-row>

<!--          <el-row :gutter="20">-->
<!--            <el-col :span="12">-->
<!--              <el-form-item label="校对人" prop="assessor">-->
<!--                <el-input v-model="form.assessor" placeholder="请输入校对人" />-->
<!--              </el-form-item>-->
<!--            </el-col>-->
<!--            <el-col :span="12">-->
<!--              <el-form-item label="校对时间" prop="atime">-->
<!--                <el-date-picker-->
<!--                  clearable-->
<!--                  v-model="form.atime"-->
<!--                  type="date"-->
<!--                  value-format="yyyy-MM-dd"-->
<!--                  placeholder="请选择校对时间"-->
<!--                />-->
<!--              </el-form-item>-->
<!--            </el-col>-->
<!--          </el-row>-->



<!--          &lt;!&ndash; 分类与管理 &ndash;&gt;-->
<!--          <el-row :gutter="20">-->
<!--            <el-col :span="12">-->
<!--              <el-form-item label="案卷分类" prop="topnode">-->
<!--                <el-input v-model="form.topnode" placeholder="请输入案卷分类" />-->
<!--              </el-form-item>-->
<!--            </el-col>-->
<!--            <el-col :span="12">-->
<!--              <el-form-item label="立卷人" prop="injectionperson">-->
<!--                <el-input v-model="form.injectionperson" placeholder="请输入立卷人" />-->
<!--              </el-form-item>-->
<!--            </el-col>-->
<!--          </el-row>-->

          <el-row :gutter="20">
<!--            <el-col :span="12">-->
<!--              <el-form-item label="立卷时间" prop="injectiondate">-->
<!--                <el-date-picker-->
<!--                  clearable-->
<!--                  v-model="form.injectiondate"-->
<!--                  type="date"-->
<!--                  value-format="yyyy-MM-dd"-->
<!--                  placeholder="请选择立卷时间"-->
<!--                />-->
<!--              </el-form-item>-->
<!--            </el-col>-->

            <el-col :span="8">
              <el-form-item label="审核人" prop="checkperson">
                <el-input v-model="form.checkperson" placeholder="请输入审核人" />
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="审核时间" prop="checkdate">
                <el-date-picker
                  clearable
                  v-model="form.checkdate"
                  type="date"
                  value-format="yyyy-MM-dd"
                  placeholder="请选择审核时间"
                />
              </el-form-item>
            </el-col>
          </el-row>

          <el-row :gutter="20">
            <el-col :span="16">
              <el-form-item label="备注">
                <el-input v-model="form.checkperson" placeholder="" />
              </el-form-item>
            </el-col>
          </el-row>


<!--          &lt;!&ndash; 备注 &ndash;&gt;-->
<!--          <el-form-item label="备注">-->
<!--            <editor v-model="form.content" :min-height="192" />-->
<!--          </el-form-item>-->

<!--          <el-row :gutter="20">-->
<!--            <el-col :span="12">-->
<!--              <el-form-item label="审核时间" prop="checkdate">-->
<!--                <el-date-picker-->
<!--                  clearable-->
<!--                  v-model="form.checkdate"-->
<!--                  type="date"-->
<!--                  value-format="yyyy-MM-dd"-->
<!--                  placeholder="请选择审核时间"-->
<!--                />-->
<!--              </el-form-item>-->
<!--            </el-col>-->
<!--            <el-col :span="12">-->
<!--              <el-form-item label="工程id" prop="regprojid">-->
<!--                <el-input v-model="form.regprojid" placeholder="请输入工程id" />-->
<!--              </el-form-item>-->
<!--            </el-col>-->
<!--          </el-row>-->

<!--          &lt;!&ndash; 存储路径 &ndash;&gt;-->
<!--          <el-row :gutter="20">-->
<!--            <el-col :span="12">-->
<!--              <el-form-item label="电子档案保存路径" prop="path">-->
<!--                <el-input v-model="form.path" placeholder="请输入电子档案保存位置" />-->
<!--              </el-form-item>-->
<!--            </el-col>-->
<!--            <el-col :span="12">-->
<!--              <el-form-item label="实体档案存放位置" prop="storeposition">-->
<!--                <el-input v-model="form.storeposition" placeholder="请输入实体档案存放位置" />-->
<!--              </el-form-item>-->
<!--            </el-col>-->
<!--          </el-row>-->
<!--          <el-form-item label="电子档案工程表" prop="eeid">-->
<!--            <el-input v-model="form.eeid" :readonly="true" placeholder="请输入电子档案工程表" />-->
<!--          </el-form-item>-->
<!--          <el-form-item label="案卷名" prop="anJuanName">-->
<!--            <el-input v-model="form.anJuanName" placeholder="请输入案卷名，数字化部输入" />-->
<!--          </el-form-item>-->
<!--          <el-form-item label="文件目录" prop="fileDirectory">-->
<!--            <el-input v-model="form.fileDirectory" placeholder="请输入文件目录" />-->
<!--          </el-form-item>-->
<!--          <el-form-item label="创建时间" prop="creationTime">-->
<!--            <el-date-picker clearable-->
<!--                            v-model="form.creationTime"-->
<!--                            type="date"-->
<!--                            value-format="yyyy-MM-dd"-->
<!--                            placeholder="请选择创建时间">-->
<!--            </el-date-picker>-->
<!--          </el-form-item>-->
<!--          <el-form-item label="盒号" prop="henum">-->
<!--            <el-input v-model="form.henum" placeholder="请输入盒号" />-->
<!--          </el-form-item>-->
<!--          <el-form-item label="文件题名" prop="tname">-->
<!--            <el-input v-model="form.tname" placeholder="请输入文件题名" />-->
<!--          </el-form-item>-->
<!--          <el-form-item label="编制单位" prop="buildorganization">-->
<!--            <el-input v-model="form.buildorganization" placeholder="请输入编制单位" />-->
<!--          </el-form-item>-->
<!--          <el-form-item label="数量/单位" prop="amount">-->
<!--            <el-input v-model="form.amount" placeholder="请输入数量/单位" />-->
<!--          </el-form-item>-->
<!--          <el-form-item label="纸张规格" prop="spec">-->
<!--            <el-input v-model="form.spec" placeholder="请输入纸张规格" />-->
<!--          </el-form-item>-->
<!--          <el-form-item label="文件开始时间" prop="filestart">-->
<!--            <el-date-picker clearable-->
<!--                            v-model="form.filestart"-->
<!--                            type="date"-->
<!--                            value-format="yyyy-MM-dd"-->
<!--                            placeholder="请选择文件开始时间">-->
<!--            </el-date-picker>-->
<!--          </el-form-item>-->
<!--          <el-form-item label="结束时间" prop="fileend">-->
<!--            <el-date-picker clearable-->
<!--                            v-model="form.fileend"-->
<!--                            type="date"-->
<!--                            value-format="yyyy-MM-dd"-->
<!--                            placeholder="请选择结束时间">-->
<!--            </el-date-picker>-->
<!--          </el-form-item>-->
<!--          <el-form-item label="保存期限" prop="savetime">-->
<!--            <el-input v-model="form.savetime" placeholder="请输入保存期限" />-->
<!--          </el-form-item>-->
<!--          <el-form-item label="级别" prop="securitylayer">-->
<!--            <el-input v-model="form.securitylayer" placeholder="请输入级别" />-->
<!--          </el-form-item>-->
<!--          <el-form-item label="主题词" prop="thematic">-->
<!--            <el-input v-model="form.thematic" placeholder="请输入主题词" />-->
<!--          </el-form-item>-->
<!--          <el-form-item label="附注" prop="annotations">-->
<!--            <el-input v-model="form.annotations" placeholder="请输入附注" />-->
<!--          </el-form-item>-->
<!--          <el-form-item label="文件总数" prop="totalfile">-->
<!--            <el-input v-model="form.totalfile" placeholder="请输入文件总数" />-->
<!--          </el-form-item>-->
<!--          <el-form-item label="总页数" prop="totalpage">-->
<!--            <el-input v-model="form.totalpage" placeholder="请输入总页数" />-->
<!--          </el-form-item>-->
<!--          <el-form-item label="文字页数" prop="txtpage">-->
<!--            <el-input v-model="form.txtpage" placeholder="请输入文字页数" />-->
<!--          </el-form-item>-->
<!--          <el-form-item label="创建人" prop="cmen">-->
<!--            <el-input v-model="form.cmen" placeholder="请输入创建人" />-->
<!--          </el-form-item>-->
<!--          <el-form-item label="创建时间" prop="ctime">-->
<!--            <el-date-picker clearable-->
<!--                            v-model="form.ctime"-->
<!--                            type="date"-->
<!--                            value-format="yyyy-MM-dd"-->
<!--                            placeholder="请选择创建时间">-->
<!--            </el-date-picker>-->
<!--          </el-form-item>-->
<!--          <el-form-item label="校对人" prop="assessor">-->
<!--            <el-input v-model="form.assessor" placeholder="请输入校对人" />-->
<!--          </el-form-item>-->
<!--          <el-form-item label="校对时间" prop="atime">-->
<!--            <el-date-picker clearable-->
<!--                            v-model="form.atime"-->
<!--                            type="date"-->
<!--                            value-format="yyyy-MM-dd"-->
<!--                            placeholder="请选择校对时间">-->
<!--            </el-date-picker>-->
<!--          </el-form-item>-->
<!--          <el-form-item label="备注">-->
<!--            <editor v-model="form.content" :min-height="192"/>-->
<!--          </el-form-item>-->
<!--          <el-form-item label="案卷分类" prop="topnode">-->
<!--            <el-input v-model="form.topnode" placeholder="请输入案卷分类" />-->
<!--          </el-form-item>-->
<!--          <el-form-item label="立卷人" prop="injectionperson">-->
<!--            <el-input v-model="form.injectionperson" placeholder="请输入立卷人" />-->
<!--          </el-form-item>-->
<!--          <el-form-item label="立卷时间" prop="injectiondate">-->
<!--            <el-date-picker clearable-->
<!--                            v-model="form.injectiondate"-->
<!--                            type="date"-->
<!--                            value-format="yyyy-MM-dd"-->
<!--                            placeholder="请选择立卷时间">-->
<!--            </el-date-picker>-->
<!--          </el-form-item>-->
<!--          <el-form-item label="审核人" prop="checkperson">-->
<!--            <el-input v-model="form.checkperson" placeholder="请输入审核人" />-->
<!--          </el-form-item>-->
<!--          <el-form-item label="审核时间" prop="checkdate">-->
<!--            <el-date-picker clearable-->
<!--                            v-model="form.checkdate"-->
<!--                            type="date"-->
<!--                            value-format="yyyy-MM-dd"-->
<!--                            placeholder="请选择审核时间">-->
<!--            </el-date-picker>-->
<!--          </el-form-item>-->
<!--          <el-form-item label="工程id" prop="regprojid">-->
<!--            <el-input v-model="form.regprojid" placeholder="请输入工程id" />-->
<!--          </el-form-item>-->
<!--          <el-form-item label="电子档案保存路径" prop="path">-->
<!--            <el-input v-model="form.path" placeholder="请输入电子档案保存位置" />-->
<!--          </el-form-item>-->
<!--          <el-form-item label="实体档案存放位置" prop="storeposition">-->
<!--            <el-input v-model="form.storeposition" placeholder="请输入实体档案存放位置" />-->
<!--          </el-form-item>-->
<!--          &lt;!&ndash;        <el-form-item label="${comment}" prop="volumeYuliu1">&ndash;&gt;-->
<!--          &lt;!&ndash;          <el-input v-model="form.volumeYuliu1" placeholder="请输入${comment}" />&ndash;&gt;-->
<!--          &lt;!&ndash;        </el-form-item>&ndash;&gt;-->
<!--          &lt;!&ndash;        <el-form-item label="${comment}" prop="volumeYuliu2">&ndash;&gt;-->
<!--          &lt;!&ndash;          <el-input v-model="form.volumeYuliu2" placeholder="请输入${comment}" />&ndash;&gt;-->
<!--          &lt;!&ndash;        </el-form-item>&ndash;&gt;-->
<!--          &lt;!&ndash;        <el-form-item label="${comment}" prop="volumeYuliu3">&ndash;&gt;-->
<!--          &lt;!&ndash;          <el-input v-model="form.volumeYuliu3" placeholder="请输入${comment}" />&ndash;&gt;-->
<!--          &lt;!&ndash;        </el-form-item>&ndash;&gt;-->
<!--          &lt;!&ndash;        <el-form-item label="${comment}" prop="volumeYuliu4">&ndash;&gt;-->
<!--          &lt;!&ndash;          <el-input v-model="form.volumeYuliu4" placeholder="请输入${comment}" />&ndash;&gt;-->
<!--          &lt;!&ndash;        </el-form-item>&ndash;&gt;-->
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button type="primary" @click="submitForm">确 定</el-button>
          <el-button @click="cancel">取 消</el-button>
        </div>
      </el-dialog>
      <!-- 文件信息 -->
      <el-col :span="7">
        <el-card style="height: 780px" v-loading="fileLoading">
          <div slot="header" class="search-header">
            <div class="show_title button-group" style="margin-bottom: 5px">文件列表：</div>
            <div class="button-group" style="margin-left: auto">
              <el-button type="primary" size="mini" @click="downloadFiles" v-if="downloadFlag">下载</el-button>
              <el-button type="primary" size="mini" @click="downloadChange" v-if="fileList.length > 0">
                {{ downloadFlag ? '取消' : '批量下载' }}
              </el-button>
            </div>
            <!-- 新增、编辑、删除按钮 -->
            <div class="button-group" style="margin-top: 10px;">
              <el-col :span="1.5">
                <el-button
                  type="primary"
                  plain
                  icon="el-icon-plus"
                  size="mini"
                  :disabled="single2"
                  @click="addFile"
                  v-if="currentInfo==='anjuan'">新增</el-button>
              </el-col>
<!--              <el-col :span="1.5">-->
<!--                <el-button-->
<!--                  type="success"-->
<!--                  plain-->
<!--                  icon="el-icon-edit"-->
<!--                  size="mini"-->
<!--                  :disabled="multiple"-->
<!--                  @click="editFile"-->
<!--                  v-hasPermi="['system:file:edit']"-->
<!--                  v-if="currentInfo==='file'">修改</el-button>-->
<!--              </el-col>-->
              <el-col :span="1.5">
                <el-button
                  type="danger"
                  plain
                  icon="el-icon-delete"
                  size="mini"
                  :disabled="multiple"
                  @click="deleteFile"
                  v-if="currentInfo==='file'">删除</el-button>
              </el-col>
            </div>
          </div>
          <div class="engs-container" ref="fileContainer">
            <div
              class="eng-row"
              v-for="file in fileList"
              :key="file.id"
              @click="selectFile(file)"
              @dblclick="openFile(file)"
              :class="{ selected: file === selectedFile }"
            >
              <input type="checkbox" v-model="file.selected" @click.stop="selectFiles(file)" v-if="downloadFlag"/>
              <i class="folder-icon file-folder-icon"></i>
              <div slot="reference" class="name-wrapper">
                <span class="folder-name" style="display: inline-block; width: 100%; word-wrap: break-word; white-space: normal;">{{ file.wenJianName }}</span>
              </div>
            </div>
          </div>
          <div class="pagination-container">
            <!-- 分页信息 -->
            <el-pagination
              @size-change="handleSizeChangeFile"
              @current-change="handleCurrentChangeFile"
              :current-page.sync="fileQueryParams.pageNum"
              :page-size.sync="fileQueryParams.pageSize"
              layout="total, prev, pager, next, jumper"
              :total="fileTotal"
            ></el-pagination>
          </div>
        </el-card>
      </el-col>
    </el-row>

    <el-row :gutter="10" style="margin-left: 5px; margin-top: 5px; margin-right: 5px">
      <el-card>
        <el-row v-if="currentInfo === 'eng'">
          <el-col :span="24">
            <eng :eng="selectedEng" @updateEng="getEngList"/>
          </el-col>
        </el-row>

        <el-row v-else-if="currentInfo === 'anjuan'">
          <el-col :span="24">
            <anjuan :anjuan="selectedAnjuan" @updateAnjaun="getAnjuanList"/>
          </el-col>
        </el-row>

        <el-row v-else-if="currentInfo === 'file'">
          <el-col :span="24">
            <file :file="selectedFile" @updateFile="getFileList"/>
          </el-col>
        </el-row>
      </el-card>
    </el-row>

    <el-dialog :visible.sync="videoDialogVisible" center v-loading="loadingMp4" title="文件详情" :before-close="handleVideoDialogClose">
      <video :src="videoUrl"
             autoplay="autoplay"
             ref="vueRef"
             controls width="100%">
        Your browser does not support the video tag.
      </video>
    </el-dialog>

    <!-- 添加或修改文件对话框 -->
    <el-dialog :title="title" :visible.sync="open_file" width="1500px" append-to-body
               :close-on-click-modal="false"
               :close-on-press-escape="false">
      <el-form ref="form" :model="form" :rules="rules" label-width="100px">

        <el-row :gutter="20">
          <el-col :span="16">
            <el-form-item label="文件名" prop="wenJianName">
              <el-input v-model="form.wenJianName" placeholder="请输入文件名" />
            </el-form-item>
          </el-col>
        </el-row>

        <el-row :gutter="20">
          <el-col :span="8">
            <el-form-item label="文件编号" prop="efilenum">
              <el-input v-model="form.efilenum" placeholder="请输入文件编号" />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="文件时间" prop="filetime">
              <el-date-picker clearable
                              v-model="form.filetime"
                              type="date"
                              value-format="yyyy-MM-dd"
                              placeholder="请选择文件时间">
              </el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="页数" prop="pagenumber">
              <el-input v-model="form.pagenumber" placeholder="请输入页数" />
            </el-form-item>
          </el-col>
        </el-row>

        <el-row :gutter="20">
          <el-col :span="8">
            <el-form-item label="文件类型" prop="filetype">
              <el-select v-model="form.filetype" placeholder="请选择文件类型">
                <el-option
                  v-for="item in filetypeOptions"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="保存期限" prop="savetime">
              <el-input v-model="form.savetime" placeholder="请输入保存期限" />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="密级" prop="securitylayer">
              <el-input v-model="form.securitylayer" placeholder="请输入密级" />
            </el-form-item>
          </el-col>
        </el-row>

        <el-row :gutter="20">
          <el-col :span="8">
            <el-form-item label="纸张类型" prop="papertype">
              <el-input v-model="form.papertype" placeholder="请输入纸张类型" />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="建设单位" prop="buildorganization">
              <el-input v-model="form.buildorganization" placeholder="请输入建设单位" />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="责任者" prop="duty">
              <el-input v-model="form.duty" placeholder="请输入责任者" />
            </el-form-item>
          </el-col>
        </el-row>

        <el-row :gutter="20">
          <el-col :span="8">
            <el-form-item label="电子文件上传" prop="filepath">
              <file-upload v-model="form.filepath"/>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row :gutter="20">
          <el-col :span="8">
          </el-col>
          <el-col :span="8">
          </el-col>
          <el-col :span="8">
          </el-col>
        </el-row>


<!--      <el-row :gutter="20">-->
<!--        <el-col :span="12">-->
<!--          <el-form-item label="电子档案案卷表" prop="eaid">-->
<!--            <el-input v-model="form.eaid" :readonly="true" placeholder="请输入电子档案案卷表" />-->
<!--          </el-form-item>-->
<!--        </el-col>-->
<!--        <el-col :span="12">-->
<!--          <el-form-item label="案卷级档案表" prop="aid">-->
<!--            <el-input v-model="form.aid" placeholder="请输入案卷级档案表" />-->
<!--          </el-form-item>-->
<!--        </el-col>-->
<!--      </el-row>-->

<!--      <el-row :gutter="20">-->
<!--        <el-col :span="12">-->
<!--          <el-form-item label="文件名" prop="wenJianName">-->
<!--            <el-input v-model="form.wenJianName" placeholder="请输入文件名" />-->
<!--          </el-form-item>-->
<!--        </el-col>-->
<!--        <el-col :span="12">-->
<!--          <el-form-item label="文件数" prop="pageShu">-->
<!--            <el-input v-model="form.pageShu" placeholder="请输入文件数" />-->
<!--          </el-form-item>-->
<!--        </el-col>-->
<!--      </el-row>-->

<!--      <el-row :gutter="20">-->
<!--        <el-col :span="12">-->
<!--          <el-form-item label="文件目录" prop="fileDirectory">-->
<!--            <el-input v-model="form.fileDirectory" placeholder="请输入文件目录" />-->
<!--          </el-form-item>-->
<!--        </el-col>-->
<!--        <el-col :span="12">-->
<!--          <el-form-item label="状态值" prop="state">-->
<!--            <el-input v-model="form.state" placeholder="请输入状态值 0：表示未被绑定  1：表示已被绑定" />-->
<!--          </el-form-item>-->
<!--        </el-col>-->
<!--      </el-row>-->

<!--      <el-row :gutter="20">-->
<!--        <el-col :span="12">-->
<!--          <el-form-item label="创建时间" prop="creationTime">-->
<!--            <el-date-picker clearable-->
<!--                            v-model="form.creationTime"-->
<!--                            type="date"-->
<!--                            value-format="yyyy-MM-dd"-->
<!--                            placeholder="请选择创建时间">-->
<!--            </el-date-picker>-->
<!--          </el-form-item>-->
<!--        </el-col>-->
<!--        <el-col :span="12">-->
<!--          <el-form-item label="文件id" prop="fileId">-->
<!--            <el-input v-model="form.fileId" placeholder="请输入文件id" />-->
<!--          </el-form-item>-->
<!--        </el-col>-->
<!--      </el-row>-->

<!--      <el-row :gutter="20">-->
<!--        <el-col :span="12">-->
<!--          <el-form-item label="文件编号" prop="efilenum">-->
<!--            <el-input v-model="form.efilenum" placeholder="请输入文件编号" />-->
<!--          </el-form-item>-->
<!--        </el-col>-->
<!--        <el-col :span="12">-->
<!--          <el-form-item label="列表号" prop="listId">-->
<!--            <el-input v-model="form.listId" placeholder="请输入列表号" />-->
<!--          </el-form-item>-->
<!--        </el-col>-->
<!--      </el-row>-->

      <!-- 文件属性 -->
<!--      <el-row :gutter="20">-->
<!--        <el-col :span="12">-->
<!--          <el-form-item label="索引id" prop="indexId">-->
<!--            <el-input v-model="form.indexId" placeholder="请输入索引id" />-->
<!--          </el-form-item>-->
<!--        </el-col>-->
<!--        <el-col :span="12">-->
<!--          <el-form-item label="案卷ID" prop="volumeid">-->
<!--            <el-input v-model="form.volumeid" placeholder="请输入案卷ID" />-->
<!--          </el-form-item>-->
<!--        </el-col>-->
<!--      </el-row>-->

<!--      <el-row :gutter="20">-->
<!--        <el-col :span="12">-->
<!--          <el-form-item label="旧案卷ID" prop="oldvolumeid">-->
<!--            <el-input v-model="form.oldvolumeid" placeholder="请输入旧案卷ID" />-->
<!--          </el-form-item>-->
<!--        </el-col>-->
<!--        <el-col :span="12">-->
<!--          <el-form-item label="文件题名" prop="filename">-->
<!--            <el-input v-model="form.filename" placeholder="请输入文件题名" />-->
<!--          </el-form-item>-->
<!--        </el-col>-->
<!--      </el-row>-->

<!--      <el-row :gutter="20">-->
<!--        <el-col :span="12">-->
<!--          <el-form-item label="责任者" prop="duty">-->
<!--            <el-input v-model="form.duty" placeholder="请输入责任者" />-->
<!--          </el-form-item>-->
<!--        </el-col>-->
<!--        <el-col :span="12">-->
<!--          <el-form-item label="文件编号" prop="tagnum">-->
<!--            <el-input v-model="form.tagnum" placeholder="请输入文件编号" />-->
<!--          </el-form-item>-->
<!--        </el-col>-->
<!--      </el-row>-->

<!--      <el-row :gutter="20">-->
<!--        <el-col :span="12">-->
<!--          <el-form-item label="主题词" prop="thematic">-->
<!--            <el-input v-model="form.thematic" placeholder="请输入主题词" />-->
<!--          </el-form-item>-->
<!--        </el-col>-->
<!--        <el-col :span="12">-->
<!--          <el-form-item label="创建时间" prop="ctime">-->
<!--            <el-date-picker clearable-->
<!--                            v-model="form.ctime"-->
<!--                            type="date"-->
<!--                            value-format="yyyy-MM-dd"-->
<!--                            placeholder="请选择创建时间">-->
<!--            </el-date-picker>-->
<!--          </el-form-item>-->
<!--        </el-col>-->
<!--      </el-row>-->

      <!-- 存储与安全 -->
<!--      <el-row :gutter="20">-->
<!--        <el-col :span="12">-->
<!--          <el-form-item label="页数" prop="pagenumber">-->
<!--            <el-input v-model="form.pagenumber" placeholder="请输入页数" />-->
<!--          </el-form-item>-->
<!--        </el-col>-->
<!--        <el-col :span="12">-->
<!--          <el-form-item label="密级" prop="securitylayer">-->
<!--            <el-input v-model="form.securitylayer" placeholder="请输入密级" />-->
<!--          </el-form-item>-->
<!--        </el-col>-->
<!--      </el-row>-->

<!--      <el-row :gutter="20">-->
<!--        <el-col :span="12">-->
<!--          <el-form-item label="文件类型" prop="filetype">-->
<!--            <el-input v-model="form.filetype" placeholder="请输入文件类型" />-->
<!--          </el-form-item>-->
<!--          <el-form-item label="文件类型" prop="filetype">-->
<!--            <el-select v-model="form.filetype" placeholder="请选择文件类型">-->
<!--              <el-option-->
<!--                v-for="item in filetypeOptions"-->
<!--                :key="item.value"-->
<!--                :label="item.label"-->
<!--                :value="item.value">-->
<!--              </el-option>-->
<!--            </el-select>-->
<!--          </el-form-item>-->
<!--        </el-col>-->
<!--        <el-col :span="12">-->
<!--          <el-form-item label="保存期限" prop="savetime">-->
<!--            <el-input v-model="form.savetime" placeholder="请输入保存期限" />-->
<!--          </el-form-item>-->
<!--        </el-col>-->
<!--      </el-row>-->

<!--      <el-row :gutter="20">-->
<!--        <el-col :span="12">-->
<!--          <el-form-item label="文件时间" prop="filetime">-->
<!--            <el-date-picker clearable-->
<!--                            v-model="form.filetime"-->
<!--                            type="date"-->
<!--                            value-format="yyyy-MM-dd"-->
<!--                            placeholder="请选择文件时间">-->
<!--            </el-date-picker>-->
<!--          </el-form-item>-->
<!--        </el-col>-->
<!--        <el-col :span="12">-->
<!--          <el-form-item label="文件号" prop="fileno">-->
<!--            <el-input v-model="form.fileno" placeholder="请输入文件号" />-->
<!--          </el-form-item>-->
<!--        </el-col>-->
<!--      </el-row>-->

      <!-- 附加信息 -->
<!--      <el-row :gutter="20">-->
<!--        <el-col :span="12">-->
<!--          <el-form-item label="附件" prop="fileatt">-->
<!--            <el-input v-model="form.fileatt" placeholder="请输入附件" />-->
<!--          </el-form-item>-->
<!--        </el-col>-->
<!--        <el-col :span="12">-->
<!--          <el-form-item label="载体类型" prop="carriertype">-->
<!--            <el-input v-model="form.carriertype" placeholder="请输入载体类型" />-->
<!--          </el-form-item>-->
<!--        </el-col>-->
<!--      </el-row>-->

<!--      <el-row :gutter="20">-->
<!--        <el-col :span="12">-->
<!--          <el-form-item label="文件总数量" prop="totalnum">-->
<!--            <el-input v-model="form.totalnum" placeholder="请输入文件总数量" />-->
<!--          </el-form-item>-->
<!--        </el-col>-->
<!--        <el-col :span="12">-->
<!--          <el-form-item label="总数量" prop="total">-->
<!--            <el-input v-model="form.total" placeholder="请输入总数量" />-->
<!--          </el-form-item>-->
<!--        </el-col>-->
<!--      </el-row>-->

<!--      <el-row :gutter="20">-->
<!--        <el-col :span="12">-->
<!--          <el-form-item label="纸张类型" prop="papertype">-->
<!--            <el-input v-model="form.papertype" placeholder="请输入纸张类型" />-->
<!--          </el-form-item>-->
<!--        </el-col>-->
<!--        <el-col :span="12">-->
<!--          <el-form-item label="建设单位" prop="buildorganization">-->
<!--            <el-input v-model="form.buildorganization" placeholder="请输入建设单位" />-->
<!--          </el-form-item>-->
<!--        </el-col>-->
<!--      </el-row>-->

<!--      <el-row :gutter="20">-->
<!--        <el-col :span="12">-->
<!--          <el-form-item label="编制单位" prop="wcompanyId">-->
<!--            <el-input v-model="form.wcompanyId" placeholder="请输入编制单位" />-->
<!--          </el-form-item>-->
<!--        </el-col>-->
<!--        <el-col :span="12">-->
<!--          <el-form-item label="档号" prop="vnum">-->
<!--            <el-input v-model="form.vnum" placeholder="请输入档号" />-->
<!--          </el-form-item>-->
<!--        </el-col>-->
<!--      </el-row>-->

<!--      <el-row :gutter="20">-->
<!--        <el-col :span="12">-->
<!--          <el-form-item label="是否归档" prop="isArchived">-->
<!--            <el-input v-model="form.isArchived" placeholder="请输入是否归档" />-->
<!--          </el-form-item>-->
<!--        </el-col>-->
<!--        <el-col :span="12">-->
<!--          <el-form-item label="项目索引" prop="projIndex">-->
<!--            <el-input v-model="form.projIndex" placeholder="请输入项目索引" />-->
<!--          </el-form-item>-->
<!--        </el-col>-->
<!--      </el-row>-->

      <!-- 文档内容 -->
<!--      <el-row :gutter="20">-->
<!--        <el-col :span="12">-->
<!--          <el-form-item label="附注" prop="comments">-->
<!--            <el-input v-model="form.comments" placeholder="请输入附注" />-->
<!--          </el-form-item>-->
<!--        </el-col>-->
<!--        <el-col :span="12">-->
<!--          <el-form-item label="摘要" prop="abstracts">-->
<!--            <el-input v-model="form.abstracts" placeholder="请输入摘要" />-->
<!--          </el-form-item>-->
<!--        </el-col>-->
<!--      </el-row>-->

<!--      <el-row :gutter="20">-->
<!--        <el-col :span="12">-->
<!--          <el-form-item label="关键字" prop="keywords">-->
<!--            <el-input v-model="form.keywords" placeholder="请输入关键字" />-->
<!--          </el-form-item>-->
<!--        </el-col>-->
<!--        <el-col :span="12">-->
<!--          <el-form-item label="电子文件存放路径" prop="filepath">-->
<!--            <file-upload v-model="form.filepath"/>-->
<!--          </el-form-item>-->
<!--        </el-col>-->
<!--      </el-row>-->

      <!-- 额外信息 -->
<!--      <el-row :gutter="20">-->
<!--        <el-col :span="12">-->
<!--          <el-form-item label="文件信息预留1" prop="fileReserved1">-->
<!--            <el-input v-model="form.fileReserved1" placeholder="请输入文件信息预留1" />-->
<!--          </el-form-item>-->
<!--        </el-col>-->
<!--      </el-row>-->
<!--      <el-form ref="form" :model="form" :rules="rules" label-width="80px">-->
<!--        <el-form-item label="电子档案案卷表" prop="eaid">-->
<!--          <el-input v-model="form.eaid" :readonly="true" placeholder="请输入电子档案案卷表" />-->
<!--        </el-form-item>-->
<!--        <el-form-item label="案卷级档案表" prop="aid">-->
<!--          <el-input v-model="form.aid" placeholder="请输入案卷级档案表" />-->
<!--        </el-form-item>-->
<!--        <el-form-item label="文件名" prop="wenJianName">-->
<!--          <el-input v-model="form.wenJianName" placeholder="请输入文件名" />-->
<!--        </el-form-item>-->
<!--        <el-form-item label="文件数" prop="pageShu">-->
<!--          <el-input v-model="form.pageShu" placeholder="请输入文件数" />-->
<!--        </el-form-item>-->
<!--        <el-form-item label="文件目录" prop="fileDirectory">-->
<!--          <el-input v-model="form.fileDirectory" placeholder="请输入文件目录" />-->
<!--        </el-form-item>-->
<!--        <el-form-item label="状态值" prop="state">-->
<!--          <el-input v-model="form.state" placeholder="请输入状态值 0：表示未被绑定  1：表示已被绑定" />-->
<!--        </el-form-item>-->
<!--        <el-form-item label="创建时间" prop="creationTime">-->
<!--          <el-date-picker clearable-->
<!--                          v-model="form.creationTime"-->
<!--                          type="date"-->
<!--                          value-format="yyyy-MM-dd"-->
<!--                          placeholder="请选择创建时间">-->
<!--          </el-date-picker>-->
<!--        </el-form-item>-->
<!--        <el-form-item label="文件id" prop="fileId">-->
<!--          <el-input v-model="form.fileId" placeholder="请输入文件id" />-->
<!--        </el-form-item>-->
<!--        <el-form-item label="文件编号" prop="efilenum">-->
<!--          <el-input v-model="form.efilenum" placeholder="请输入文件编号" />-->
<!--        </el-form-item>-->
<!--        &lt;!&ndash;        <el-form-item label="${comment}" prop="listnum">&ndash;&gt;-->
<!--        &lt;!&ndash;          <el-input v-model="form.listnum" placeholder="请输入${comment}" />&ndash;&gt;-->
<!--        &lt;!&ndash;        </el-form-item>&ndash;&gt;-->
<!--        <el-form-item label="列表号" prop="listId">-->
<!--          <el-input v-model="form.listId" placeholder="请输入列表号" />-->
<!--        </el-form-item>-->
<!--        <el-form-item label="索引id" prop="indexId">-->
<!--          <el-input v-model="form.indexId" placeholder="请输入索引id" />-->
<!--        </el-form-item>-->
<!--        <el-form-item label="案卷ID" prop="volumeid">-->
<!--          <el-input v-model="form.volumeid" placeholder="请输入案卷ID" />-->
<!--        </el-form-item>-->
<!--        <el-form-item label="旧案卷ID" prop="oldvolumeid">-->
<!--          <el-input v-model="form.oldvolumeid" placeholder="请输入旧案卷ID" />-->
<!--        </el-form-item>-->
<!--        <el-form-item label="文件题名" prop="filename">-->
<!--          <el-input v-model="form.filename" placeholder="请输入文件题名" />-->
<!--        </el-form-item>-->
<!--        <el-form-item label="责任者" prop="duty">-->
<!--          <el-input v-model="form.duty" placeholder="请输入责任者" />-->
<!--        </el-form-item>-->
<!--        <el-form-item label="文件编号" prop="tagnum">-->
<!--          <el-input v-model="form.tagnum" placeholder="请输入文件编号" />-->
<!--        </el-form-item>-->
<!--        &lt;!&ndash;        <el-form-item label="${comment}" prop="filenum">&ndash;&gt;-->
<!--        &lt;!&ndash;          <el-input v-model="form.filenum" placeholder="请输入${comment}" />&ndash;&gt;-->
<!--        &lt;!&ndash;        </el-form-item>&ndash;&gt;-->
<!--        <el-form-item label="主题词" prop="thematic">-->
<!--          <el-input v-model="form.thematic" placeholder="请输入主题词" />-->
<!--        </el-form-item>-->
<!--        <el-form-item label="创建时间" prop="ctime">-->
<!--          <el-date-picker clearable-->
<!--                          v-model="form.ctime"-->
<!--                          type="date"-->
<!--                          value-format="yyyy-MM-dd"-->
<!--                          placeholder="请选择创建时间">-->
<!--          </el-date-picker>-->
<!--        </el-form-item>-->
<!--        <el-form-item label="页数" prop="pagenumber">-->
<!--          <el-input v-model="form.pagenumber" placeholder="请输入页数" />-->
<!--        </el-form-item>-->
<!--        <el-form-item label="密级" prop="securitylayer">-->
<!--          <el-input v-model="form.securitylayer" placeholder="请输入密级" />-->
<!--        </el-form-item>-->
<!--        <el-form-item label="文件类型" prop="filetype">-->
<!--          <el-input v-model="form.filetype" placeholder="请输入文件类型" />-->
<!--        </el-form-item>-->
<!--        <el-form-item label="保存期限" prop="savetime">-->
<!--          <el-input v-model="form.savetime" placeholder="请输入保存期限" />-->
<!--        </el-form-item>-->
<!--        <el-form-item label="文件时间" prop="filetime">-->
<!--          <el-date-picker clearable-->
<!--                          v-model="form.filetime"-->
<!--                          type="date"-->
<!--                          value-format="yyyy-MM-dd"-->
<!--                          placeholder="请选择文件时间">-->
<!--          </el-date-picker>-->
<!--        </el-form-item>-->
<!--        <el-form-item label="文件号" prop="fileno">-->
<!--          <el-input v-model="form.fileno" placeholder="请输入文件号" />-->
<!--        </el-form-item>-->
<!--        <el-form-item label="附件" prop="fileatt">-->
<!--          <el-input v-model="form.fileatt" placeholder="请输入附件" />-->
<!--        </el-form-item>-->
<!--        <el-form-item label="载体类型" prop="carriertype">-->
<!--          <el-input v-model="form.carriertype" placeholder="请输入载体类型" />-->
<!--        </el-form-item>-->
<!--        <el-form-item label="文件总数量" prop="totalnum">-->
<!--          <el-input v-model="form.totalnum" placeholder="请输入文件总数量" />-->
<!--        </el-form-item>-->
<!--        <el-form-item label="总数量" prop="total">-->
<!--          <el-input v-model="form.total" placeholder="请输入总数量" />-->
<!--        </el-form-item>-->
<!--        <el-form-item label="纸张类型" prop="papertype">-->
<!--          <el-input v-model="form.papertype" placeholder="请输入纸张类型" />-->
<!--        </el-form-item>-->
<!--        <el-form-item label="建设单位" prop="buildorganization">-->
<!--          <el-input v-model="form.buildorganization" placeholder="请输入建设单位" />-->
<!--        </el-form-item>-->
<!--        <el-form-item label="编制单位" prop="wcompanyId">-->
<!--          <el-input v-model="form.wcompanyId" placeholder="请输入编制单位" />-->
<!--        </el-form-item>-->
<!--        <el-form-item label="档号" prop="vnum">-->
<!--          <el-input v-model="form.vnum" placeholder="请输入档号" />-->
<!--        </el-form-item>-->
<!--        <el-form-item label="是否归档" prop="isArchived">-->
<!--          <el-input v-model="form.isArchived" placeholder="请输入是否归档" />-->
<!--        </el-form-item>-->
<!--        <el-form-item label="项目索引" prop="projIndex">-->
<!--          <el-input v-model="form.projIndex" placeholder="请输入项目索引" />-->
<!--        </el-form-item>-->
<!--        <el-form-item label="附注" prop="comments">-->
<!--          <el-input v-model="form.comments" placeholder="请输入附注" />-->
<!--        </el-form-item>-->
<!--        <el-form-item label="摘要" prop="abstracts">-->
<!--          <el-input v-model="form.abstracts" placeholder="请输入摘要" />-->
<!--        </el-form-item>-->
<!--        <el-form-item label="关键字" prop="keywords">-->
<!--          <el-input v-model="form.keywords" placeholder="请输入关键字" />-->
<!--        </el-form-item>-->
<!--        <el-form-item label="电子文件存放路径" prop="filepath">-->
<!--          <file-upload v-model="form.filepath"/>-->
<!--        </el-form-item>-->
<!--        <el-form-item label="文件信息预留1" prop="fileReserved1">-->
<!--          <el-input v-model="form.fileReserved1" placeholder="请输入文件信息预留1" />-->
<!--        </el-form-item>-->
<!--        &lt;!&ndash;        <el-form-item label="${comment}" prop="fileReserved2">&ndash;&gt;-->
<!--        &lt;!&ndash;          <el-input v-model="form.fileReserved2" placeholder="请输入${comment}" />&ndash;&gt;-->
<!--        &lt;!&ndash;        </el-form-item>&ndash;&gt;-->
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitFormFile">确 定</el-button>
        <el-button @click="cancelFile">取 消</el-button>
      </div>
    </el-dialog>


    <!-- 文件显示弹窗 -->
    <el-dialog :visible.sync="pdfDialogVisible" title="文件详情" :width="dialogWidth" center v-dialog-drag v-dialog-drag-width v-dialog-drag-height :close-on-click-modal = "false">
      <embed :src="pdfUrl" type="application/pdf" width="100%" style="height: 80vh" >
    </el-dialog>
    <el-image-viewer v-if="imgDialogVisible" :zIndex="Number(99999)" :url-list="canvasList"
                     :on-close="closeImgViewer"/>
  </div>
</template>

<script>
import {listEng,addEng, delEng, getEng, updateEng} from "@/api/system/eng";
import {addAnjuan, delAnjuan, getAnjuan, listAnjuan, updateAnjuan} from "@/api/system/anjuan";
import {addFile, delFile, downloadMore, getFile, getPdf, listFile, updateFile} from "@/api/system/file";
// import {listEng,addEng, delEng, getEng, updateEng} from "../../../api/system/eng";
// import {addAnjuan, delAnjuan, getAnjuan, listAnjuan, updateAnjuan} from "../../../api/system/anjuan";
// import {addFile, delFile, downloadMore, getFile, getPdf, listFile, updateFile} from "../../../api/system/file";
import Eng from "./eng.vue";
import Anjuan from "./anjuan.vue";
import File from "./file.vue";
import { v4 as uuidv4 } from 'uuid'


export default {
  components: {
    Eng,
    Anjuan,
    File,
    'el-image-viewer': () => import('element-ui/packages/image/src/image-viewer')
  },
  data() {
    return {
      canvasList: [],
      videoDialogVisible: false, // 控制弹窗的显示与隐藏
      loadingMp4: false,
      videoUrl: "", // 存储视频文件的URL地址
      showAdvancedSearch: false, // 初始时为简单搜索模式
      engList: [], //工程列表
      anjuanList: [], //案卷列表
      fileList: [], //文件列表

      engTotal: 0, //工程总数
      anjuanTotal: 0, //案卷总数
      fileTotal: 0, //文件总数

      single: true,
      multiple: true,
      single1: true,
      single2: true,

      selectedEng: null,
      selectedAnjuan: null,
      selectedFile: null,
      currentInfo: "eng",

      engQueryParams: {
        pageNum: 1,
        pageSize: 20,
        engName: null,
        register:null
      },
      anjuanQueryParams: {
        pageNum: 1,
        pageSize: 20,
        eeid: null,
        anJuanName: null,
      },
      fileQueryParams: {
        pageNum: 1,
        pageSize: 20,
        eaid: null,
        wenJianName: null,
      },
      filetype: "pdf",
      engLoading: false,
      anjuanLoading: false,
      fileLoading: false,

      filetypeOptions: [
        { value: 'jpg', label: 'jpg' },
        { value: 'jpeg', label: 'jpeg' },
        { value: 'gif', label: 'gif' },
        { value: 'pdf', label: 'pdf' },
        { value:'tif', label: 'tif'},
        { value:'tiff', label: 'tiff'},
      ],
      statusOptions: [{
        "label": "未检测",
        "value": 0
      }, {
        "label": "检测通过",
        "value": 1
      }, {
        "label": "已进入流程",
        "value": 2
      },{
        "label": "分卷中",
        "value": 3
      },{
        "label": "已归档",
        "value": 4
      }],

      rules: {
        // 定义验证规则
        engineeringIdentificationNumber:[
          { required:true,message:"工程识别号不能为空", trigger: "blur" }
        ],
        unitConstructionCategory: [
          { required:true,message:"单位工程类型不能为空", trigger: "blur" }
        ],
        archiveCategory: [
          { required:true,message:"档案类属不能为空", trigger: "blur" }
        ],
        startDate: [
          { required:true,message:"开工日期不能为空", trigger: "blur" }
        ],
        explorationUnit: [
          { required:true,message:"勘察单位不能为空", trigger: "blur" }
        ],
        designUnit: [
          { required:true,message:"设计单位不能为空", trigger: "blur" }
        ],
        register: [
          { required:true,message:"注册表id不能为空", trigger: "blur" }
        ],
        wenJianName: [
          { required:true,message:"文件名不能为空", trigger: "blur" }
        ],
        filetype: [
          { required: true, message: '请选择文件类型', trigger: 'change' },
          { required: true, message: "文件类型不能为空", trigger: "blur" },
          {
            validator: (rule, value, callback) => {
              if (value) {
                const validExtensions = ['pdf', 'tif','tiff','jpg','png','jpeg'];
                if (validExtensions.includes(value.toLowerCase())) {
                  callback(); // 验证通过
                } else {
                  callback(new Error('文件类型必须为 PDF , TIF , TIFF , JPG , PNG , JPEG')); // 验证失败
                }
              } else {
                // 如果 value 为空，那么之前的 required 规则会处理这个情况
                callback();
              }
            },
            trigger: "blur"
          }
        ],
        filepath:[
          { required: true, message: "文件路径不能为空", trigger: "blur" }
        ]
      },
      // 弹出层标题
      title: "",
      // 是否显示弹出层
      open: false,
      open_file:false,
      open_eng:false,
      // 选中数组
      ids: [],
      // 表单参数
      form: {},
      now_eaid:null,
      now_eeid:null,
      now_id:null,
      blobImage: "", //图片url
      pdfUrl: "", // 存储PDF文件的URL地址
      pdfDialogVisible: false, // 控制弹窗的显示与隐藏
      imgDialogVisible: false, // 控制弹窗的显示与隐藏
      dialogWidth: "70%", // 弹窗的宽度
      dialogHeight: "80vh",
      selectedFiles: [], // 存储被选中的文件的数组
      downloadFlag: false, //下载显示勾选框
      projectId:null,
    };
  },
  created() {
    this.$data.projectId = this.$route.query && this.$route.query.projectId;
    if (this.$data.projectId) {
      this.engQueryParams.register = this.$data.projectId;
    }
    this.getEngList();
  },
  methods: {
    closeImgViewer()    {
      this.imgDialogVisible = false
    },
    // 取消按钮
    cancel() {
      this.open = false;
      this.reset();
    },
    // 表单重置
    reset() {
      this.form = {
        id: null,
        eeid: null,
        anJuanName: null,
        fileDirectory: null,
        creationTime: null,
        henum: null,
        vtype: null,
        tname: null,
        buildorganization: null,
        amount: null,
        spec: null,
        filestart: null,
        fileend: null,
        savetime: null,
        securitylayer: null,
        thematic: null,
        annotations: null,
        totalfile: null,
        totalpage: null,
        txtpage: null,
        cmen: null,
        ctime: null,
        assessor: null,
        atime: null,
        content: null,
        topnode: null,
        injectionperson: null,
        injectiondate: null,
        checkperson: null,
        checkdate: null,
        regprojid: null,
        path: null,
        storeposition: null,
        volumeYuliu1: null,
        volumeYuliu2: null,
        volumeYuliu3: null,
        volumeYuliu4: null
      };
      this.resetForm("form");
    },
    /** 新增案卷按钮操作 */
    handleAdd() {
      this.reset();
      console.log(this.now_eeid);
      this.form.eeid=this.now_eeid;
      this.open = true;
      this.title = "添加案卷管理";
    },
    /** 编辑案卷按钮操作 */
    handleUpdate(row) {
      this.reset();
      const id = row.id || this.ids
      getAnjuan(this.now_eaid).then(response => {
        this.form = response.data;
        this.open = true;
        this.title = "编辑案卷管理";
      });
    },
    /** 提交按钮 */
    submitForm() {
      this.$refs["form"].validate(valid => {
        if (valid) {
          if (this.form.id != null) {
            updateAnjuan(this.form).then(response => {
              this.$modal.msgSuccess("修改成功");
              this.open = false;
              this.getAnjuanList();
            });
          } else {
            this.form.id=uuidv4();
            addAnjuan(this.form).then(response => {
              this.$modal.msgSuccess("新增成功");
              this.open = false;
              this.getAnjuanList();
            });
          }
        }
      });
    },
    /** 删除按钮操作 */
    handleDelete(row) {
      const id = this.now_eaid;
      this.$modal.confirm('是否确认删除案卷管理编号为"' + id + '"的数据项？').then(function() {
        return delAnjuan(id);
      }).then(() => {
        this.getAnjuanList();
        this.$modal.msgSuccess("删除成功");
      }).catch(() => {});
    },
    //获取工程信息
    getEngList() {
      this.engLoading = true;
      listEng(this.engQueryParams)
        .then((response) => {
          setTimeout(() => {
            this.engList = response.rows;
            this.engTotal = response.total;
            this.engLoading = false;
          }, 300);
        })
        .catch((error) => {
          this.$message.error("获取工程信息失败:" + error);
          this.engLoading = false;
        });
    },
    searchEng() {
      this.engQueryParams.pageNum = 1;
      this.getEngList();
    },
    toggleSearchMode() {
      this.showAdvancedSearch = !this.showAdvancedSearch;
    },
    resetEng() {
      this.engQueryParams = {
        pageNum: 1,
        pageSize: 20,
      };
      this.getEngList();
    },
    selectEng(eng) {
      this.single2 = true;
      this.single1 = false;
      this.single=true;
      this.multiple = true;
      this.$data.now_eeid=eng.id;
      this.selectedEng = eng;
      this.currentInfo = "eng";
      this.anjuanQueryParams.eeid  = eng.id;
      // this.anjuanQueryParams.regprojid = '20130101/6-41092158-2671-492c-8d0f-96082f95979d'
      this.getAnjuanList();
    },
    downloadFile() {
      // 实现下载文件的逻辑
      const link = document.createElement("a");
      link.href = this.blobImage;
      link.download = "file.jpg";
      link.click();
    },
    printFile() {
      // 实现打印文件的逻辑
      const printWindow = window.open("", "_blank");
      printWindow.document.write(
        `<img src="${this.blobImage}" style="max-width: 100%; height: auto;">`
      );
      printWindow.document.close();
      printWindow.print();
    },
    handleSizeChangeEng(pageSize) {
      this.engQueryParams.pageSize = pageSize;
      this.getEngList();
    },
    handleCurrentChangeEng(currentPage) {
      this.engQueryParams.pageNum = currentPage;
      this.getEngList();
    },
    //获取案卷信息
    getAnjuanList() {
      this.anjuanLoading = true;
      this.fileList = [];
      listAnjuan(this.anjuanQueryParams)
        .then((response) => {
          setTimeout(() => {
            this.anjuanList = response.rows;
            this.anjuanTotal = response.total;
            this.anjuanLoading = false;
          }, 300);
        })
        .catch((error) => {
          this.$message.error("获取案卷信息失败:" + error);
          this.anjuanLoading = false;
        });
    },
    searchAnjuan() {
      this.anjuanQueryParams.pageNum = 1;
      this.getAnjuanList();
    },
    resetAnjuan() {
      // this.anjuanQueryParams.regprojid = null
      this.anjuanQueryParams.anJuanName = null;
      if (this.anjuanQueryParams.eeid != null) {
        this.getAnjuanList();
      }
    },
    selectAnjuan(anjuan) {
      this.single1 = true;
      this.single2 = false;
      this.single=false;
      this.multiple = true;
      this.$data.now_eaid=anjuan.id;
      this.selectedAnjuan = anjuan;
      this.currentInfo = "anjuan";
      this.fileQueryParams.eaid = anjuan.id;
      this.getFileList();
    },
    handleSizeChangeAnjuan(pageSize) {
      this.anjuanQueryParams.pageSize = pageSize;
      this.getAnjuanList();
    },
    handleCurrentChangeAnjuan(currentPage) {
      this.anjuanQueryParams.pageNum = currentPage;
      this.getAnjuanList();
    },
    //获取文件信息
    getFileList() {
      this.fileLoading = true;
      listFile(this.fileQueryParams).then((response) => {
        response.rows.forEach((file) => {
          file.selected = false; // 为每个数据对象添加selected属性，初始值为false
        });
        setTimeout(() => {
          this.fileList = response.rows;
          this.fileTotal = response.total;
          this.fileLoading = false;
        }, 300);
      }).catch((error) => {
        this.$message.error("获取文件信息失败:" + error);
        this.fileLoading = false;
      });
    },
    //选中文件
    // selectFile(file) {
    //   this.single2 = true;
    //   this.single1 = true;
    //   this.multiple = false;
    //   this.single=true;
    //   this.now_id = file.id;
    //   this.selectedFile = file;
    //   this.filetype=file.filetype;
    //   this.currentInfo = "file";
    // },
    selectFile(file) {
      this.single2 = true;
      this.single1 = true;
      this.multiple = false;
      this.single=true;
      this.now_id = file.id;
      this.fileUrl = `${this.baseURL}${file.filepath}`;
      this.selectedFile = file;
      this.filename = file.wenJianName;
      this.filetype=file.filetype;
      this.currentInfo = "file";
    },
    //选中多个文件
    selectFiles(file) {
      // 如果文件已经选中，取消选中并从selectedFiles数组中移除
      const index = this.selectedFiles.findIndex(selectedFile => selectedFile.id === file.id);
      if (file.selected) {
        file.selected = false;
        if (index !== -1) {
          this.selectedFiles.splice(index, 1); // 使用splice方法移除指定索引的元素
        }
      } else {
        // 如果文件未选中，选中并添加到selectedFiles数组中
        file.selected = true;
        this.selectedFiles.push(file);
      }
    },
    //展开/关闭下载
    downloadChange() {
      this.fileList.forEach((file) => {
        file.selected = false; // 为每个数据对象添加selected属性，初始值为false
      });
      this.selectedFiles = [];
      this.downloadFlag = !this.downloadFlag;
    },
    //下载多个文件
    downloadFiles() {
      if (this.selectedFiles.length === 0) {
        this.$message({
          message: '请先选择要下载的文件！',
          type: 'warning'
        });
      } else if (this.selectedFiles.length === 1) {
        this.selectedFiles.forEach(file => {
          this.downloadOneFile(file);
        })
      } else {
        let ids = [];
        this.selectedFiles.forEach(file => {
          ids.push(file.id)
        })
        downloadMore(ids).then((response) => {
          // 处理接收到的二进制ZIP文件数据
          const blob = new Blob([response], {type: "application/zip"});
          const url = window.URL.createObjectURL(blob);
          // 创建一个下载链接并触发点击以下载ZIP文件
          const a = document.createElement('a');
          a.href = url;
          a.download = 'downloaded.zip';
          a.style.display = 'none';
          document.body.appendChild(a);
          a.click();
          window.URL.revokeObjectURL(url);
        });
      }
    },
    // 下载单个文件名打开文件
    downloadOneFile(file) {
      getPdf(file).then( res => {
        // 处理接收到的二进制ZIP文件数据
        const blob = new Blob([res], {type: "application/pdf"});
        const url = window.URL.createObjectURL(blob);
        // 创建一个下载链接并触发点击以下载ZIP文件
        const a = document.createElement('a');
        a.href = url;
        a.download = file.wenJianName + "." + file.filetype;
        a.style.display = 'none';
        document.body.appendChild(a);
        a.click();
        window.URL.revokeObjectURL(url);
      })
    },
    openFile(file) {
      const filetype = this.filetype; // 这里假设 this.filetype 已经是一个字符串
      const lowerCaseFileType = filetype.toLowerCase();
      switch (lowerCaseFileType) {
        case 'pdf':
          this.openPDF(file);
          break;
        case 'jpg':
          this.openImg(file);
          break;
        case 'jpeg':
          this.openImg(file);
          break;
        case 'tif':
          this.openTiff(file);
          break;
        case 'tiff':
          this.openTiff(file);
          break;
        case 'gif':
          this.openImg(file);
          break;
        case 'mp4':
          this.openMp4(file);
          break;
        default:
          console.error('Unsupported file type:', filetype);
          alert('Unsupported file type. Please check the file and try again.');
      }
    },
    //打开图片
    openImg(file) {
      this.canvasList = [];
      this.fileForm = file; // 将文件信息保存到fileForm中，以便在getPdf函数中使用
      getPdf(this.fileForm)
        .then((response) => {
          const blob = new Blob([response], {type: "image/jpeg/jpg/gif"});
          this.blobImage = URL.createObjectURL(blob);
          this.canvasList.push(URL.createObjectURL(blob))
          this.imgDialogVisible = true; // 显示弹窗
        })
        .catch((error) => {
          console.error("获取图片时出错:", error);
        });
    },
    openTiff(file) {
      this.canvasList = [];
      this.fileForm = file;
      getPdf(this.fileForm).then((response) => {
        var tiff = new Tiff({buffer: response})
        for (let i = 0, len = tiff.countDirectory(); i < len; ++i) {
          tiff.setDirectory(i)
          var imgs = tiff.toDataURL() // 转化成base64
          if (imgs) {
            this.canvasList.push(imgs)
            this.imgDialogVisible = true;
          }
        }
        console.log(this.canvasList)
      }).catch((error) => {
        console.error("获取图片时出错:", error);
        // 可以添加错误处理逻辑，比如显示一个错误提示框等
      });
    },
    //打开PDF
    openPDF(file) {
      this.fileForm = file; // 将文件信息保存到fileForm中，以便在getPdf函数中使用
      getPdf(this.fileForm)
        .then((response) => {
          const blob = new Blob([response], {type: "application/pdf"});
          this.pdfUrl = URL.createObjectURL(blob);
          this.pdfDialogVisible = true; // 显示弹窗
        })
        .catch((error) => {
          console.error("Error occurred while fetching the PDF:", error);
          // 可以添加错误处理逻辑，比如显示一个错误提示框等
        });
    },
    openMp4(file) {
      this.videoDialogVisible = true; // 显示弹窗
      this.loadingMp4 = true;
      getPdf(file).then((response) => {
        const blob = new Blob([response], {type: "video/mp4"});
        this.videoUrl = URL.createObjectURL(blob);
      }).catch((error) => {
        console.error("获取文件时出错:", error);
      });
      this.loadingMp4 = false;
    },
    handleSizeChangeFile(pageSize) {
      this.fileQueryParams.pageSize = pageSize;
      this.getFileList();
    },
    handleCurrentChangeFile(currentPage) {
      this.fileQueryParams.pageNum = currentPage;
      this.getFileList();
    },
    handleVideoDialogClose(done){
      this.$refs.vueRef.pause();
      done(); // 调用 done() 完成弹窗的关闭操作
    },

    // 文件表单重置
    resetFile() {
      this.form = {
        id: null,
        eaid: null,
        aid: null,
        wenJianName: null,
        pageShu: null,
        fileDirectory: null,
        state: null,
        creationTime: null,
        fileId: null,
        efilenum: null,
        listnum: null,
        listId: null,
        indexId: null,
        volumeid: null,
        oldvolumeid: null,
        filename: null,
        duty: null,
        tagnum: null,
        filenum: null,
        thematic: null,
        ctime: null,
        pagenumber: null,
        securitylayer: null,
        filetype: null,
        savetime: null,
        filetime: null,
        fileno: null,
        fileatt: null,
        carriertype: null,
        totalnum: null,
        total: null,
        papertype: null,
        buildorganization: null,
        wcompanyId: null,
        vnum: null,
        isArchived: null,
        projIndex: null,
        comments: null,
        abstracts: null,
        keywords: null,
        filepath: null,
        fileReserved1: null,
        fileReserved2: null
      };
      this.resetForm("form");
    },
    /** 文件新增按钮操作 */
    addFile() {
      this.resetFile();
      this.form.eaid = this.now_eaid;
      this.open_file = true;
      this.title = "添加文件";
    },
    /** 修改按钮操作 */
    editFile(row) {
      this.resetFile();
      const id = row.id || this.ids
      getFile(this.now_id).then(response => {
        this.form = response.data;
        this.open_file = true;
        this.title = "修改文件";
      });
    },
    /** 提交按钮 */
    submitFormFile() {
      this.$refs["form"].validate(valid => {
        if (valid) {
          if (this.form.id != null) {
            updateFile(this.form).then(response => {
              this.$modal.msgSuccess("修改成功");
              this.open_file = false;
              this.getFileList();
            });
          } else {
            this.form.id=uuidv4();
            addFile(this.form).then(response => {
              this.$modal.msgSuccess("新增成功");
              this.open_file = false;
              this.getFileList();
            });
          }
        }
      });
    },
    // 取消按钮
    cancelFile() {
      this.open_file = false;
      this.reset();
    },
    /** 删除按钮操作 */
    deleteFile(row) {
      const id = this.now_id;
      this.$modal.confirm('是否确认删除文件编号为"' + id + '"的数据项？').then(function() {
        return delFile(id);
      }).then(() => {
        this.getFileList();
        this.$modal.msgSuccess("删除成功");
      }).catch(() => {});
    },

    // 表单重置
    reseteng() {
      this.form = {
        id: null,
        engName: null,
        engNo: null,
        dangAnGuanNo: null,
        yiJiaoDanWei: null,
        bianZhiDanWei: null,
        bianZhiDateStart: null,
        bianZhiDateEnd: null,
        EngAddress: null,
        engCost: null,
        AnJuanShu: null,
        dangAnGuanName: null,
        shuZiHuaDanWei: null,
        projectStatus: null,
        fileDirectory: null,
        creationTime: null,
        isNewEng: null,
        isHasOtherFile: null,
        yuLiuA: null,
        yuLiuB: null,
        yuLiuC: null,
        yuLiuD: null,
        yuLiuE: null,
        engineeringIdentificationNumber: null,
        unitConstructionCategory: null,
        archiveClassification: null,
        archiveCategory: null,
        buildingUnit: null,
        projectApprovalUnit: null,
        projectApprovalNumber: null,
        planningPermitNumber: null,
        landPlanningPermitNumber: null,
        landUsePermitNumber: null,
        constructionPermitNumber: null,
        totalLength: null,
        archivePageNumber: null,
        startDate: null,
        completionDate: null,
        startPoint: null,
        endPoint: null,
        explorationUnit: null,
        explorationProjectLeader: null,
        designUnit: null,
        designProjectLeader: null,
        register: null
      };
      this.resetForm("form");
    },
    /** 新增工程按钮操作 */
    handleEngAdd() {
      this.reseteng();
      this.open_eng = true;
      this.title = "添加工程";
    },
    /** 编辑工程按钮操作 */
    handleEngUpdate(row) {
      this.reseteng();
      const id = this.$data.now_eeid
      getEng(id).then(response => {
        this.form = response.data;
        this.open_eng = true;
        this.title = "修改工程";
      });
    },
    /** 删除按钮操作 */
    handleEngDelete(row) {
      const id = this.$data.now_eeid;
      this.$modal.confirm('是否确认删除编号为"' + id + '"的数据项？').then(function() {
        return delEng(id);
      }).then(() => {
        this.getEngList();
        this.$modal.msgSuccess("删除成功");
      }).catch(() => {});
    },
    submitFormEng() {
      this.form.yuLiuB = 0;
      this.form.register=this.$data.projectId;
      this.$refs["form"].validate(valid => {
        if (valid) {
          if (this.form.id != null) {
            updateEng(this.form).then(response => {
              this.$modal.msgSuccess("修改成功");
              this.open_eng = false;
              this.getEngList();
            });
          } else {
            this.form.id=uuidv4();
            addEng(this.form).then(response => {
              this.$modal.msgSuccess("新增成功");
              this.open_eng = false;
              this.getEngList();
            });
          }
        }
      });
    },
    cancelEng() {
      this.open_eng = false;
      this.reseteng();
    },
  },
};
</script>

<style>
/* 公共样式 */
.search-header {
  display: flex;
  align-items: center;
}

.my_input {
  margin-left: auto;
  width: 15%;
  margin-right: 5px;
}


.button-group {
  display: flex;
  justify-content: center;
  margin-top: 10px;
}

.engs-container {
  height: 600px;
  overflow-y: auto;
}

.eng-row {
  flex-basis: 100%;
  margin-bottom: 10px;
  display: flex;
  align-items: center;
}

.eng-row:hover {
  cursor: pointer;
  background-color: #e5f3ff;
}

.pagination-container {
  margin-top: 10px;
}

.folder-icon {
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  margin-right: 5px;
  background-size: cover;
}

.folder-name {
  flex-grow: 1;
  font-size: 14px;
  color: #333;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.show_title {
  font-weight: bold;
  font-size: 0.4rem;
  color: rgb(26, 115, 198);
}

.dialog-content {
  display: flex;
  flex-direction: column;
}

.button-group {
  display: flex;
  justify-content: space-between;
  margin-bottom: 10px;
}


/* 选中状态的样式 */
.selected {
  /*box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);*/
  background-color: #cce8ff;
}
.search-header {
  display: flex;
  align-items: center;
}

.my_input {
  margin-left: auto;
  width: 37%;
}


.dialog-content {
  display: flex;
  flex-direction: column;
}

.my_button {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 10px;
  margin-left: 85%;
}

.button-group {
  display: flex;
  justify-content: center;
  margin-top: 10px;
}

.engs-container {
  height: 600px;
  overflow-y: auto;
}

.eng-row {
  flex-basis: 100%;
  margin-bottom: 10px;
  display: flex;
  align-items: center;
}

.eng-row:hover {
  cursor: pointer;
  background-color: #E5F3FF;
}

.pagination-container {
  margin-top: 10px;
}

.folder-icon {
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  margin-right: 5px;
  background-size: cover;
}

.folder-name {
  flex-grow: 1;
  font-size: 14px;
  color: #333;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}


.show_title {
  font-weight: bold;
  font-size: 20px;
  color: rgb(26, 115, 198);
}

.dialog-content {
  display: flex;
  flex-direction: column;
}

.button-group {
  display: flex;
  justify-content: space-between;
  margin-bottom: 10px;
}

/* 不同图标的样式 */
.eng-folder-icon {
  background-image: url("~@/assets/icons/folder/eng-icon.png");
}

.volume-folder-icon {
  background-image: url("~@/assets/icons/folder/volume-icon.png");
}

.file-folder-icon {
  background-image: url("~@/assets/icons/folder/file-icon.png");
}

/* 选中状态的样式 */
.selected {
  /*box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);*/
  background-color: #CCE8FF;
}
</style>

